<template>
  <div class="feedback-page">
    <h1>问题反馈</h1>
    <div class="feedback-form">
      <textarea v-model="form.wen" placeholder="你想说点什么？"></textarea>
      <input v-model="form.lian" type="text" placeholder="联系方式 注：手机号/微信/QQ" />
      <p class="hint">请留下任意一个联系方式</p>
      <button @click="submitFeedback">提交</button>
    </div>
  </div>
</template>




<script>
import axios from 'axios';
import { Toast } from "vant";
export default {
  data() {
    return {
      tableData: [],
      form: {
        wen: "",
        lian: "",
      },

    };
  },
  methods: {
    submitFeedback() {
      if (!this.form.wen.trim() || !this.form.lian.trim()) {
        Toast.fail('请填写反馈内容');
        return;
      }
      axios.post(`http://localhost:6001/admin/feedback/chang`, this.form)
          .then(response => {
            console.log(response.data);
            // 提交成功
            Toast.success('反馈提交成功');
            this.$router.go(-1);
          })
          .catch(error => {
            console.error("There was an error!", error);
            Toast.fail('反馈提交失败');
          });
    },
  },
  created() {
  }

};
</script>

<style scoped>
.feedback-page {
  padding: 20px;
  max-width: 600px;
  margin: 0 auto;
}

h1 {
  text-align: center;
  margin-bottom: 20px;
}

.feedback-options {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 20px;
}

.option {
  padding: 10px 15px;
  border: 1px solid #ccc;
  border-radius: 5px;
  cursor: pointer;
  transition: background-color 0.3s;
}

.option:hover {
  background-color: #f0f0f0;
}

.feedback-form {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

textarea {
  width: 100%;
  height: 100px;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 5px;
  resize: none;
}

input {
  width: 100%;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 5px;
}

.hint {
  font-size: 12px;
  color: #666;
}

button {
  padding: 10px 20px;
  background-color: #007bff;
  color: white;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  transition: background-color 0.3s;
}

button:hover {
  background-color: #0056b3;
}
</style>
